<template>
  <div class="common-body-wrapper" style="position:unset;">
    <search-header single-width="130" :searchList="searchList" @changeHeight="toRetTable" @confirmSearch="toSearch"
    :isNeedTree="true" :isCheckbox="true" :paramName="paramName" @setSelectedNode="setSelectedNode"
    ></search-header>
    <div class="common-table-tree-wrapper">
      <div class="common-table-wrapper">
        <multi-fun-table :sortColumn='notFormatColumn' :orderType='sortType' :fixed-cols="fixedCols" :is-reset-table="isResetTable" :theads-info="theadsInfo" :tbodys-info="tbodysInfo" @handleMultiCheck="handleMultiCheck" @handleSortColumn="handleSortColumn" @searchFn="getList" @getNextPage="getNextPage">
          <!--按钮-->
          <div class="operate-btn-group" slot="operateBtnGroup">
            <a class="ake_btn ake_btn_text" v-if="isPermmited('MONTH:TICKET:MANAGE:SAVE')" @click.prevent="createTicket2('创建月票')">创建月票</a>
          </div>

          <!--普通列-->
          <template slot="tdCell" slot-scope="props">
            <el-table-column :fixed="props.fixed" :label="props.label" :min-width="props.minWidth" :width="props.width" :prop="props.prop" :sortable="props.sortable">
              <template slot-scope="scope">
                <span v-if="'reno' == props.prop">{{ scope.$index + 1 }}</span>
                <span v-else-if="'maxSellLimit'==props.prop && scope.row.maxSellLimit=='YES'">{{scope.row.maxSellNum}}</span>
                <span v-else-if="'maxSellLimit'==props.prop && scope.row.maxSellLimit=='NO'">无限</span>
                <span v-else-if="'ticketName' == props.prop" class="row-href" @click="forceEdit=false;monthTicketTypeCheck(scope.row)">{{scope.row.ticketName}}</span>
                <span v-else-if="'parkList' == props.prop" @click.prevent="supportParkShowModal(scope.row)" class="row-href">查看({{scope.row.parkList.length}})</span>
                <span v-else-if="'price' == props.prop">{{scope.row.price|formatMoney}}元</span>
                <span v-else-if="'sellNum' == props.prop">{{scope.row.sellNum}}</span>
                <span v-else-if="'updateTime' == props.prop">{{scope.row.updateTime|mileSecondToDate}}</span>
                <span v-else>{{ scope.row[props.prop] }}</span>
              </template>
            </el-table-column>
          </template>

          <!--操作列内的按钮-->
          <template slot="operateCell" slot-scope="props">
            <el-table-column :fixed="props.fixed" :label="props.label" width="250" class-name="operateCell">
              <template slot-scope="scope">
                <el-button size="small" type="primary" icon="icon-edit" class="ake-icon-font" title="编辑" v-if="isPermmited('MONTH:TICKET:MANAGE:SAVE') && scope.row.sellNum == 0" :disabled="scope.row.parkSysType===0 && scope.row.ticketStatus==='VALID'" @click="forceEdit=false;modifyTicket(scope.row,'基础信息-'+scope.row.ticketName)" plain ></el-button>
                <el-button size="small" type="primary" icon="icon-edit" class="ake-icon-font" title="强制编辑" v-if="isPermmited('MONTH:TICKET:MANAGE:FORCE_SAVE') && scope.row.sellNum > 0" :disabled="scope.row.parkSysType===0 && scope.row.ticketStatus==='VALID'" @click="forceEdit=true;modifyTicket(scope.row,'基础信息-'+scope.row.ticketName)" plain></el-button>

                <el-button size="small" type="primary" icon="icon-gjpz_normal" class="ake-icon-font" title="高级配置" plain @click="forceEdit=false;modifyTicket(scope.row,'高级配置-'+scope.row.ticketName)" :disabled="scope.row.parkSysType===0 && scope.row.ticketStatus=='VALID'" ></el-button>
                <el-button :disabled="scope.row.parkSysType!==1" size="small" type="primary" icon="icon-yy_normal" class="ake-icon-font" title="显示及语音" @click="textVoice(scope.row,'显示及语音')" plain></el-button>

                <el-button size="small" type="primary" icon="icon-downShelves" class="ake-icon-font" title="已过期" v-if="isPermmited('MONTH:TICKET:MANAGE:UPDATESTATUS') && scope.row.ticketStatus == 'EXPIRED'" plain :disabled="true"></el-button>

                <el-button size="small" type="primary" icon="icon-downShelves" class="ake-icon-font" title="下架" v-if="isPermmited('MONTH:TICKET:MANAGE:UPDATESTATUS') && scope.row.ticketStatus == 'VALID'" :disabled="scope.row.ticketStatus != 'VALID'" @click="updateStatusTicket(scope.row,'INVALID')" plain></el-button>
                <el-button size="small" type="primary" icon="icon-onShelves" class="ake-icon-font" title="上架" v-if="isPermmited('MONTH:TICKET:MANAGE:UPDATESTATUS') && scope.row.ticketStatus == 'INVALID'" :disabled="scope.row.ticketStatus != 'INVALID'" @click="updateStatusTicket(scope.row,'VALID')" plain></el-button>

                <el-button size="small" type="primary" icon="icon-synchronize" class="ake-icon-font" title="同步详情" v-if="isPermmited('MONTH:TICKET:MANAGE:UPDATESTATUS')" @click="synchronismDetialModal(scope.row)" plain :disabled="scope.row.parkSysType!=0"></el-button>

                <el-button @click="delTicket(scope.row)" size="small" type="danger" icon="icon-delete" class="ake-icon-font" :disabled="scope.row.sellNum > 0 || scope.row.ticketStatus == 'VALID'" title="删除" v-if="isPermmited('MONTH:TICKET:MANAGE:DEL')" plain></el-button>
              </template>
            </el-table-column>
          </template>
        </multi-fun-table>

        <table-pagination :size="total" :cur-page="pageNumber" @backData="getPagination"></table-pagination>
      </div>
    </div>

    <!--modal-->
    <!--至少选择一项  modal-->
    <basic-modal ref="voidTipModal" bodyTxt="请至少选择一项">
      <h3 slot="title">温馨提示</h3>
      <div class="modal-footer" slot="modal-footer">
        <button class="ake_btn ake_btn_text modal-close" @click="closed('voidTipModal')">关闭</button>
      </div>
    </basic-modal>

    <!-- 日期控件 -->
    <basic-modal ref="multiCalendarModal" customeClass="multi-calendar-modal" static="true" width="100%" :needModalFooter="false">
      <a slot="modal-icon-close" class="close" @click="closed('multiCalendarModal')">&times;</a>
      <h3 slot="title">选择日期</h3>
      <div class="modal-body manageBody" slot="modal-body">
        <!-- selectedDate: 当前已经选中的日期数组 -->
        <!-- min: 当前可选的最小日期 -->
        <!-- max: 当前可选的最大日期 -->
        <!-- save 点击保存时会调用的方法，回传参数为当前选择的日期数组 -->
        <calendar v-if="modalStatus===3" :disabledStatus="true" :isCanEdit="false" :selectedDate="monthTicketCheckObj.superiorData.priDateArrStr"></calendar>
        <calendar v-else-if="modalStatus===1 || modalStatus===2" :selectedDate="vipTypeData.priDateArrStr" @save="saveCalendar"></calendar>
      </div>
    </basic-modal>

    <!--创建or编辑月票-->
    <basic-modal ref="monthlyTicketModal" customeClass="monthly-ticket-modal" width="700" static="true">
      <h3 slot="title">{{mouthTicketData.ticketModalName}}</h3>
      <div class="modal-body" slot="modal-body" style="padding:0px">
        <div class="btnGroup" v-if="modalStatus!=2">
          <div @click="selectMonthTicketInfoTab('basicTab')" class="btnItem" :class="{activeText:mouthTicketData.tabName=='basicTab'}">
            <span class="step-icon" :class="{activeTab:mouthTicketData.tabName=='basicTab'}">1</span>
            <span class="step-text">基础信息</span>
          </div>
          <div @click="selectMonthTicketInfoTab('higherTab')" class="btnItem" :class="{activeText:mouthTicketData.tabName=='higherTab'}">
            <span class="step-icon" :class="{activeTab:mouthTicketData.tabName=='higherTab'}">2</span>
            <span class="step-text">高级配置</span>
          </div>
        </div>
        <el-form :model="mouthTicketData.baseTicketData" ref="ticketForm" label-position="left" :rules="rules" label-width="80px" style="padding: 30px 80px;">
          <!-- 基础信息 start -->
          <div v-show="mouthTicketData.tabName=='basicTab'" class="basicTab-box">
            <el-form-item label="通行权限" prop="parkJson">
              <div class="el-form--inline">
                <template v-if="selectedParkingLot.length">
                  <el-tooltip placement="bottom-start">
                    <div slot="content">
                      <ul class="selectParkingLotTree">
                        <li v-for="item in selectedParkingLot" style="margin-bottom: 4px; font-size: 12px;">
                          {{ item.name }}
                          <ul v-for="it in item.children">
                            <li>{{it.name}}</li>
                          </ul>
                        </li>
                      </ul>
                    </div>
                    <div class="selected-parkingLot">{{selectedParkingLotStr}}</div>
                  </el-tooltip>
                </template>

                <div v-if="!selectedParkingLot.length" class="selected-parkingLot grayTip">未选择任何停车场</div>

                <el-button size="small" type="primary" @click="openSelectParkModal" class="select-park-btn ake_btn_text">设置</el-button>
              </div>
            </el-form-item>

            <el-form-item label="财务主体" prop="financialParkId" v-show="tableData.parkItems && tableData.parkItems.length>1">
              <template>
                <el-radio-group v-model="mouthTicketData.baseTicketData.financialParkId" class="finacSubj">
                  <div class="finacSubj-item" v-for="(item,index) in tableData.parkItems">
                    <el-radio :label="item.parkId" :checked="mouthTicketData.baseTicketData.financialParkId==item.parkId">{{item.parkName}}</el-radio>
                    <!-- <div class="del-btn" @click='delectSelectParkItem(index,item.parkId)'>
                      <img src="../../assets/img/ic_subscribe_delete.svg" alt="">
                    </div> -->
                  </div>
                </el-radio-group>
              </template>
            </el-form-item>

            <el-form-item label="月票名称" prop="ticketName">
              <el-input placeholder="请输入月票名称" v-model="mouthTicketData.baseTicketData.ticketName" ></el-input>
            </el-form-item>

            <el-form-item label="月票单价" prop="price">
              <el-input placeholder="请输入月票单价" v-model="mouthTicketData.baseTicketData.price"></el-input>
              <span class="item-unit">元</span>
            </el-form-item>

            <el-form-item label="月票数量">
              <div class="el-form--inline">
                <el-select v-model="mouthTicketData.baseTicketData.maxSellLimit">
                  <el-option label="有限" value="YES"></el-option>
                  <el-option label="无限" value="NO"></el-option>
                </el-select>
                <el-form-item v-if="mouthTicketData.baseTicketData.maxSellLimit=='YES'" prop="maxSellNum" style="margin-left:10px;margin-right:0px;">
                  <el-input placeholder="请输入数量" v-model="mouthTicketData.baseTicketData.maxSellNum"></el-input>
                </el-form-item>
              </div>
            </el-form-item>

            <el-form-item label="有效期类型">
              <template>
                <el-radio class="radio" v-model="mouthTicketData.baseTicketData.renewMethod" label="NATURAL_MONTH">自然月</el-radio>
                <el-radio class="radio" v-model="mouthTicketData.baseTicketData.renewMethod" label="CUSTOM">自定义</el-radio>
              </template>
              <div class="tipsBox">
                <i class="el-icon-question"></i>
                <div class="tips bottom">
                  <p>允许车主自定义选择续费时间，价格按照天数去计算。如月票单价300元，每天则为10元。</p>
                </div>
              </div>
            </el-form-item>

            <el-form-item label="备注" prop="remark">
              <el-input placeholder="请输入备注" type="textarea" :rows="3"  v-model="mouthTicketData.baseTicketData.remark"></el-input>
            </el-form-item>
          </div>
          <!-- 基础信息 end -->

          <!-- 高级配置 start -->
          <div v-show="mouthTicketData.tabName=='higherTab'" class="higherTab-box">
            <el-form-item label="线上开通" prop="ticketType">
              <template>
                <el-radio class="radio" v-model="mouthTicketData.baseTicketData.ticketType" label="OUTTER" value="OUTTER">允许</el-radio>
                <el-radio class="radio" v-model="mouthTicketData.baseTicketData.ticketType" label="INNER" value="INNER">不允许</el-radio>
              </template>
            </el-form-item>

            <el-form-item label="月票凭证">
              <el-select  v-model="mouthTicketData.baseTicketData.certifiRuleId" popper-class="trader-select">
                <el-option
                v-for="item in options4"
                :key="item.key"
                :label="item.label"
                :value="item.value" ></el-option>
              </el-select>
            </el-form-item>

            <el-form-item label="过期续费" prop="renew">
              <template>
                <el-radio class="radio" v-model="mouthTicketData.baseTicketData.renew" :label="1">允许</el-radio>
                <el-radio class="radio" v-model="mouthTicketData.baseTicketData.renew" :label="0">不允许</el-radio>
              </template>
            </el-form-item>

            <!-- 连续续费优惠 -->
            <el-form-item prop="continueBuyFlag" label="连续续费" v-show="mouthTicketData.baseTicketData.renew==1">
              <template>
                <el-radio v-model="mouthTicketData.baseTicketData.continueBuyFlag" :label="1">无优惠</el-radio>
                <el-radio v-model="mouthTicketData.baseTicketData.continueBuyFlag" :label="2">折扣优惠</el-radio>
                <el-radio v-model="mouthTicketData.baseTicketData.continueBuyFlag" :label="3">金额优惠</el-radio>
              </template>
            </el-form-item>
            <!-- 连续续费优惠-折扣优惠-start -->
            <el-form ref="discountForm" style="width:auto;" class="renewDiscount" :model="discountOption" label-width="80px" v-show="mouthTicketData.baseTicketData.renew==1 && mouthTicketData.baseTicketData.continueBuyFlag==2">
              <!-- 分段1-start -->
              <div class="item-chunk" v-show="discountIndexArr[0]">
                <el-form-item label="连续续费" style="margin-bottom: 0">
                  <div class="item-row">
                    <div class="item-row hasUnit">
                      <el-input v-model="discountOption.month1" placeholder="请输入月数"></el-input>
                      <span class="unit">月</span>
                    </div>
                    <div class="item-row hasUnit" style="margin-left: 12px">
                      <el-input v-model="discountOption.discount1" placeholder="请输入折数"></el-input>
                      <span class="unit">折</span>
                    </div>
                  </div>
                </el-form-item>
                <el-form-item label style="margin-bottom: 0">
                  <span class="money-tip">
                    为&nbsp;
                    <span>{{discountMoney1}}元</span>
                  </span>
                </el-form-item>

                <el-form-item prop="phoneStr1" label="手机端显示">
                  <el-input v-model="discountOption.phoneStr1" ></el-input>
                </el-form-item>
                <img src="../../assets/img/close windows.svg" alt="" @click="closeDiscountChunk(0)">
              </div>
              <!-- 分段1-end -->
              <!-- 分段2-start -->
              <div class="item-chunk" v-show="discountIndexArr[1]">
                <el-form-item label="连续续费" style="margin-bottom: 0">
                  <div class="item-row">
                    <div class="item-row hasUnit">
                      <el-input v-model="discountOption.month2" placeholder="请输入月数"></el-input>
                      <span class="unit">月</span>
                    </div>
                    <div class="item-row hasUnit" style="margin-left: 12px">
                      <el-input v-model="discountOption.discount2" placeholder="请输入折数"></el-input>
                      <span class="unit">折</span>
                    </div>
                  </div>
                </el-form-item>
                <el-form-item label style="margin-bottom: 0">
                  <span class="money-tip">
                    为&nbsp;
                    <span>{{discountMoney2}}元</span>
                  </span>
                </el-form-item>

                <el-form-item prop="phoneStr1" label="手机端显示">
                  <el-input v-model="discountOption.phoneStr2" ></el-input>
                </el-form-item>
                <img src="../../assets/img/close windows.svg" alt="" @click="closeDiscountChunk(1)">
              </div>
              <!-- 分段2-end -->
              <!-- 分段3-start -->
              <div class="item-chunk" v-show="discountIndexArr[2]">
                  <el-form-item label="连续续费" style="margin-bottom: 0">
                  <div class="item-row">
                    <div class="item-row hasUnit">
                      <el-input v-model="discountOption.month3" placeholder="请输入月数"></el-input>
                      <span class="unit">月</span>
                    </div>
                    <div class="item-row hasUnit" style="margin-left: 12px">
                      <el-input v-model="discountOption.discount3" placeholder="请输入折数"></el-input>
                      <span class="unit">折</span>
                    </div>
                  </div>
                </el-form-item>
                <el-form-item label style="margin-bottom: 0">
                  <span class="money-tip">
                    为&nbsp;
                    <span>{{discountMoney3}}元</span>
                  </span>
                </el-form-item>

                <el-form-item prop="phoneStr1" label="手机端显示">
                  <el-input v-model="discountOption.phoneStr3" ></el-input>
                </el-form-item>
                <img src="../../assets/img/close windows.svg" alt="" @click="closeDiscountChunk(2)">
              </div>
              <!-- 分段3-end -->
              <!-- 分段4-start -->
              <div class="item-chunk" v-show="discountIndexArr[3]">
                <el-form-item label="连续续费" style="margin-bottom: 0">
                  <div class="item-row">
                    <div class="item-row hasUnit">
                      <el-input v-model="discountOption.month4" placeholder="请输入月数"></el-input>
                      <span class="unit">月</span>
                    </div>
                    <div class="item-row hasUnit" style="margin-left: 12px;">
                      <el-input v-model="discountOption.discount4" placeholder="请输入折数"></el-input>
                      <span class="unit">折</span>
                    </div>
                  </div>
                </el-form-item>
                <el-form-item label style="margin-bottom: 0">
                  <span class="money-tip">
                    为&nbsp;
                    <span>{{discountMoney4}}元</span>
                  </span>
                </el-form-item>
                <el-form-item prop="phoneStr1" label="手机端显示">
                  <el-input v-model="discountOption.phoneStr4" ></el-input>
                </el-form-item>
                <img src="../../assets/img/close windows.svg" alt="" @click="closeDiscountChunk(3)">
              </div>
              <!-- 分段4-end -->
              <img src="../../assets/img/ic_subscribe_add copy.svg" alt="" class="add-btn" @click="addDiscountChunk" v-show="discountIndexArr.length<4">
            </el-form>
            <!-- 连续续费优惠-折扣优惠-end -->
            <!-- 连续续费优惠-金额优惠-start -->
            <el-form ref="moneyForm" style="width:auto;" class="renewDiscount" :model="moneyOption" v-show="mouthTicketData.baseTicketData.renew==1 && mouthTicketData.baseTicketData.continueBuyFlag==3" label-width="80px">
              <!-- 分段1-start -->
              <div class="item-chunk" v-show="moneyIndexArr[0]">

                 <el-form-item label="连续续费" style="margin-bottom: 10px">
                  <div class="item-row">
                    <div class="item-row hasUnit">
                      <el-input v-model="moneyOption.month1" placeholder="请输入月数"></el-input>
                      <span class="unit">月</span>
                    </div>
                    <div class="item-row hasUnit" style="margin-left: 12px;">
                      <el-input v-model="moneyOption.money1" placeholder="请输入折数"></el-input>
                      <span class="unit">元</span>
                    </div>
                  </div>
                </el-form-item>

                <el-form-item prop="phoneStr1" label="手机端显示">
                  <el-input v-model="moneyOption.phoneStr1" ></el-input>
                </el-form-item>
                <img src="../../assets/img/close windows.svg" alt="" @click="closeMoneyChunk(0)">
              </div>
              <!-- 分段1-end -->
              <!-- 分段2-start -->
              <div class="item-chunk" v-show="moneyIndexArr[1]">
                 <el-form-item label="连续续费" style="margin-bottom: 10px">
                  <div class="item-row">
                    <div class="item-row hasUnit">
                      <el-input v-model="moneyOption.month2" placeholder="请输入月数"></el-input>
                      <span class="unit">月</span>
                    </div>
                    <div class="item-row hasUnit" style="margin-left: 12px;">
                      <el-input v-model="moneyOption.money2" placeholder="请输入折数"></el-input>
                      <span class="unit">元</span>
                    </div>
                  </div>
                </el-form-item>
                <el-form-item prop="phoneStr2" label="手机端显示">
                  <el-input v-model="moneyOption.phoneStr2" ></el-input>
                </el-form-item>
                <img src="../../assets/img/close windows.svg" alt="" @click="closeMoneyChunk(1)">
              </div>
              <!-- 分段2-end -->
              <!-- 分段3-start -->
              <div class="item-chunk" v-show="moneyIndexArr[2]">
                <el-form-item label="连续续费" style="margin-bottom: 10px">
                  <div class="item-row">
                    <div class="item-row hasUnit">
                      <el-input v-model="moneyOption.month3" placeholder="请输入月数"></el-input>
                      <span class="unit">月</span>
                    </div>
                    <div class="item-row hasUnit" style="margin-left: 12px;">
                      <el-input v-model="moneyOption.money3" placeholder="请输入折数"></el-input>
                      <span class="unit">元</span>
                    </div>
                  </div>
                </el-form-item>
                <el-form-item prop="phoneStr3" label="手机端显示">
                  <el-input v-model="moneyOption.phoneStr3" ></el-input>
                </el-form-item>
                <img src="../../assets/img/close windows.svg" alt="" @click="closeMoneyChunk(2)">
              </div>
              <!-- 分段3-end -->
              <!-- 分段4-start -->
              <div class="item-chunk" v-show="moneyIndexArr[3]">
                <el-form-item label="连续续费" style="margin-bottom: 10px">
                  <div class="item-row">
                    <div class="item-row hasUnit">
                      <el-input v-model="moneyOption.month4" placeholder="请输入月数"></el-input>
                      <span class="unit">月</span>
                    </div>
                    <div class="item-row hasUnit" style="margin-left: 12px;">
                      <el-input v-model="moneyOption.money4" placeholder="请输入折数"></el-input>
                      <span class="unit">元</span>
                    </div>
                  </div>
                </el-form-item>
                <el-form-item prop="phoneStr4" label="手机端显示">
                  <el-input v-model="moneyOption.phoneStr4" ></el-input>
                </el-form-item>
                <img src="../../assets/img/close windows.svg" alt="" @click="closeMoneyChunk(3)">
              </div>
              <!-- 分段4-end -->
              <img src="../../assets/img/ic_subscribe_add copy.svg" alt="" class="add-btn" @click="addMoneyChunk" v-show="moneyIndexArr.length<4">
            </el-form>
            <!-- 连续续费优惠-金额优惠-end -->

            <el-form-item prop="renewFormerDays" label="向前续费" v-show="mouthTicketData.baseTicketData.renew==1">
              <el-input placeholder="请输入天数（允许月票向前续费*天）" v-model.number="mouthTicketData.baseTicketData.renewFormerDays"></el-input>
              <span class="item-unit">天</span>
              <div class="tipsBox" style="right:-25px;">
                <i class="el-icon-question"></i>
                <div class="tips right">
                  <p>允许车主购买该月票时，向前续费相应的天数。</p>
                </div>
              </div>
            </el-form-item>

            <el-form-item label="无牌车" prop="supportVirtualCarcode">
              <template>
                <el-radio :label="1" v-model="mouthTicketData.baseTicketData.supportVirtualCarcode">支持</el-radio>
                <el-radio :label="0" v-model="mouthTicketData.baseTicketData.supportVirtualCarcode">不支持</el-radio>
              </template>
            </el-form-item>

            <el-form-item prop="inviteCarTotal" label="访客授权">
              <div class="inline-row first-item">
                <span style="margin-right: 10px">允许授权</span>
                <el-input placeholder="请输入数量" v-model="mouthTicketData.baseTicketData.inviteCarTotal"></el-input>
                <span style="margin-left: 10px">个访客车牌(每车位)</span>
              </div>
              <div class="tipsBox" style="right:-25px;">
                <i class="el-icon-question"></i>
                <div class="tips right">
                  <p>允许车主添加相应数量的邀请车牌，一同使用该月票的收费规则。</p>
                </div>
              </div>
            </el-form-item>

            <el-form-item label="多车多位">
              <div class="inline-row">
                <el-checkbox v-model="vipTypeData.isDynamicMode" v-bind:true-label="1" v-bind:false-label="0"></el-checkbox>
                <div class="tipsBox" style="left:10px;">
                  <i class="el-icon-question"></i>
                  <div class="tips">
                    <p>可开通≥2个车位的月票</p>
                  </div>
                </div>
              </div>

              <el-form-item label-width="0" v-show="vipTypeData.isDynamicMode">
                <el-checkbox v-model="vipTypeData.autoSwitchVip" :true-label="1" :false-label="0">支持场内切换</el-checkbox>
              </el-form-item>

              <el-form-item label-width="0" v-show="vipTypeData.isDynamicMode" style="margin-bottom:0px;">
                <el-checkbox class="sp-checkbox" v-model="vipTypeData.dynamicFullLimit" v-bind:true-label="1" v-bind:false-label="0">内场多位多车满位到剩余，同一VIP票车辆外场已在场车辆无法进入内场</el-checkbox>
                <div class="tipsBox" style="right:-24px;top:-5px;">
                  <i class="el-icon-question"></i>
                  <div class="tips right">
                    <p>外场A区域，内场B区域，一组车辆在B区域是多位多车，B区域车位从满到余时，同组车A区域在场车辆不能进入B区域。防止车主将长时间停放于A区域的车辆开入B区域而逃避停车费</p>
                  </div>
                </div>
              </el-form-item>
            </el-form-item>

            <el-form-item label="满位控制">
              <el-checkbox v-model="vipTypeData.openVipFullLimit" v-bind:true-label="1" v-bind:false-label="0"></el-checkbox>
              <el-form-item label="最多可进" label-width="90px" v-show="vipTypeData.openVipFullLimit">
                <el-input v-model.munber="vipTypeData.vipFullLimitValue" placeholder="请输入车辆数量"></el-input>
                <span class="item-unit">辆</span>
              </el-form-item>
              <el-form-item label="满位放行模式" style="margin-bottom:0px;" label-width="90px" v-show="vipTypeData.openVipFullLimit">
                <el-select v-model="vipTypeData.vipFullOpenModel" placeholder="请选择活动区域">
                  <el-option label="系统有空位自动放行，无空位手动放行按VIP计费" :value="0"></el-option>
                  <el-option label="系统有空位自动放行，无空位手动放行按临时车计费" :value="1"></el-option>
                  <el-option label="系统无空位自动放行，按临时车计费" :value="2"></el-option>
                </el-select>
              </el-form-item>
            </el-form-item>

            <el-form-item label="按日期">
              <div class="inline-row">
                <el-checkbox v-model="vipTypeData.isDatePrivilege" v-bind:true-label="1" v-bind:false-label="0"></el-checkbox>
                <el-form-item v-show="vipTypeData.isDatePrivilege" label-width="10px">
                  <a href="javascript:;" @click="openCalendar()" class="ake_btn ake_btn_text">设置日期表</a>
                </el-form-item>
                <div class="tipsBox" style="left:120px" v-show="vipTypeData.isDatePrivilege">
                  <i class="el-icon-question"></i>
                  <div class="tips">
                    <p>月票生效的日期</p>
                  </div>
                </div>
              </div>
            </el-form-item>

            <el-form-item label="按时段">
              <div class="inline-row">
                <el-checkbox v-model="vipTypeData.isTimePrivilege" v-bind:true-label="1" v-bind:false-label="0"></el-checkbox>
                <el-form-item label="" label-width="10px" v-if="vipTypeData.isTimePrivilege">
                  <el-time-picker v-model="vipTypeData.priTimeArrFrom" format="HH:mm" :editable="false" start-placeholder="开始时间">
                  </el-time-picker>
                </el-form-item>
                <el-form-item label="" label-width="10px" v-if="vipTypeData.isTimePrivilege">
                  <el-time-picker v-model="vipTypeData.priTimeArrTo" format="HH:mm" :editable="false" end-placeholder="结束时间">
                  </el-time-picker>
                </el-form-item>
                <div class="tipsBox" style="right:-24px" v-if="vipTypeData.isTimePrivilege">
                  <i class="el-icon-question"></i>
                  <div class="tips right">
                    <p>月票生效的时段</p>
                  </div>
                </div>
              </div>
            </el-form-item>

            <el-form-item label="是否计费">
              <template>
                <el-radio :label="1" v-model="vipTypeData.isChargeGroupRelated">支持</el-radio>
                <el-radio :label="0" v-model="vipTypeData.isChargeGroupRelated">不支持</el-radio>
              </template>
            </el-form-item>

            <div class="other-item-box">
              <div v-if="vipTypeData.isChargeGroupRelated==1">
                <el-form-item prop="chargeGroupCode" v-if="chargeGroupRender">
                  <template>
                    <el-table :data="tableData.parkItems" border class="select-park-table" style="width:100%">
                      <el-table-column prop="parkName" label="停车场名称">
                      </el-table-column>
                      <el-table-column prop="optionArr" label="计费组">
                        <template slot-scope="scope">
                          <el-select v-model="tableData.parkItems[scope.$index].chargeGroupCode" placeholder="请选择计费组" v-if="tableData.parkItems[scope.$index].parkSysType===1">
                            <el-option v-for="item in tableData.parkItems[scope.$index].optionArr" :label="item.typeName" :value="item.chargeTypeSeq"></el-option>
                          </el-select>
                          <el-input v-else-if="tableData.parkItems[scope.$index].parkSysType===0" v-model="tableData.parkItems[scope.$index].chargeGroupCode" placeholder="请填写计费组编号"></el-input>
                        </template>
                      </el-table-column>
                    </el-table>
                  </template>
                </el-form-item>
              </div>
            </div>

            <el-form-item label="离线月票" prop="offLine">
              <template>
                <el-radio :label="1" v-model="mouthTicketData.baseTicketData.offLine">支持</el-radio>
                <el-radio :label="0" v-model="mouthTicketData.baseTicketData.offLine">不支持</el-radio>
              </template>
              <div class="tipsBox">
                <i class="el-icon-question"></i>
                <div class="tips bottom">
                  <p>设备离线时，支持离线月票的车辆仍可正常放行</p>
                </div>
              </div>
            </el-form-item>

          </div>
          <!-- 高级配置 end -->
        </el-form>
      </div>
      <div class="modal-footer" slot="modal-footer" v-if="modalStatus==1">
        <button class="ake_btn ake_btn_text ake_btn_confirm"  @click="selectMonthTicketInfoTab('higherTab')" v-if="mouthTicketData.tabName=='basicTab'">下一步<i class="el-icon-arrow-right el-icon--right"></i></button>
        <button class="ake_btn ake_btn_text" @click="closed('monthlyTicketModal')" v-if="mouthTicketData.tabName=='basicTab'">取消</button>
        <button class="ake_btn ake_btn_text ake_btn_confirm" @click.stop="submitForm('ticketForm')" v-if="mouthTicketData.tabName=='higherTab'">确认</button>
        <button class="ake_btn ake_btn_text" @click="selectMonthTicketInfoTab('basicTab')" v-if="mouthTicketData.tabName=='higherTab'" ><i class="el-icon-arrow-left"></i>上一步</button>
      </div>
      <div class="modal-footer" slot="modal-footer" v-if="modalStatus==2">
        <button class="ake_btn ake_btn_text ake_btn_confirm" @click.stop="submitForm('ticketForm')">确认</button>
        <button class="ake_btn ake_btn_text" @click="closed('monthlyTicketModal')">取消</button>
      </div>
    </basic-modal>

    <!-- 显示及语音 start -->
    <basic-modal width="1100" ref="textVoiceModal" label-position="left" customeClass="textVoiceModal" static="true">
      <h3 slot="title">显示及语音</h3>
      <div class="modal-body" slot="modal-body" style="padding:10px 0px 0px 0px;">
        <el-form :model="vipTypeData" ref="textVoiceForm" label-position="left" label-width="40px">
          <div class="textVoiceTab-box">
            <h3 style="text-align:left;margin-bottom: 10px;position:relative;">有效期内，提醒期之前
              <div class="tipsBox" style="position:absolute;color:red;right:0;font-size: 14px;">
                <span>通配符说明</span>
                <div class="tips right" style="color:#666;right:0;top: 20px;font-size: 12px;width:265px;">
                  <p>
                    <span style="display:inline-block;width:68px;">%PT</span>停车时长</p>
                  <p>
                    <span style="display:inline-block;width:68px;">%P</span>车牌号</p>
                  <p>
                    <span style="display:inline-block;width:68px;">%C</span>应缴金额</p>
                  <p>
                    <span style="display:inline-block;width:68px;">\</span>换行</p>
                  <p>
                    <span style="display:inline-block;width:68px;">%ST</span>停车时长</p>
                  <p>
                    <span style="display:inline-block;width:68px;">%TM</span>时间，精确到秒</p>
                  <p>
                    <span style="display:inline-block;width:68px;">%TD</span>时间，精确到日</p>
                  <p>
                    <span style="display:inline-block;width:68px;">%T1S1</span>停车场1的总剩余车位</p>
                  <p>
                    <span style="display:inline-block;width:68px;">%VM</span>本地VIP别称</p>
                  <p>
                    <span style="display:inline-block;width:68px;">%VT</span>本地VIP剩余天数</p>
                  <p>
                    <span style="display:inline-block;width:68px;">%LVT</span>本地VIP临时续期时间</p>
                  <p>
                    <span style="display:inline-block;width:68px;">%VTT</span>本地VIP剩余次数</p>
                  <p>
                    <span style="display:inline-block;width:68px;">%LV</span>本地VIP临时续的次数</p>
                  <p>
                    <span style="display:inline-block;width:68px;">%VB</span>本地VIP剩余余额</p>
                  <p>
                    <span style="display:inline-block;width:68px;">%LVB</span>本地VIP临时续的余额</p>
                  <p>
                    <span style="display:inline-block;width:68px;">%V3M</span>第三方VIP别称</p>
                  <p>
                    <span style="display:inline-block;width:68px;">%HM</span>黑名单别称</p>
                  <p>
                    <span style="display:inline-block;width:68px;">%HOM</span>红名单别称</p>
                  <p>
                    <span style="display:inline-block;width:68px;">%VSVIP</span>剩余车位（多位多车情况）</p>
                  <p>
                    <span style="display:inline-block;width:68px;">%TLCW</span>当前停车场的总剩余车位</p>
                  <p>
                    <span style="display:inline-block;width:68px;">%TVTCW</span>当前停车场的总临时车位剩余数</p>
                  <p>
                    <span style="display:inline-block;width:68px;">%TVCW</span>当前停车场的总固定车位剩余数</p>
                  <p>
                    <span style="display:inline-block;width:68px;">%TZCW</span>当前停车场的总租用车位剩余数</p>
                  <p>
                    <span style="display:inline-block;width:68px;">%TMFCW</span>当前停车场的总免费车位剩余数</p>
                  <p>
                    <span style="display:inline-block;width:68px;">%TYDCW</span>当前停车场的总预订车位剩余数</p>
                  <p>
                    <span style="display:inline-block;width:68px;">%REC</span>进场自助码</p>
                  <p>
                    <span style="display:inline-block;width:68px;">%RLC</span>出场自助码</p>
                </div>
              </div>
            </h3>
            <div class="rowItem">
              <el-form-item prop="vipNearExpiredDayThreshold" label="提醒期" label-width="50px">
                <el-input v-model.number="vipTypeData.vipNearExpiredDayThreshold"></el-input>
                <span class="item-unit">天</span>
              </el-form-item>
            </div>
            <!-- 进场 -->
            <div class="row">
              <p>宽进</p>
              <p>严进</p>
            </div>
            <div class="row">
              <div class="rowItem">
                <el-form-item label="文本" label-width="40px">
                  <el-select :disabled="editModelReadonly" filterable allow-create v-model="showMessage.validInWarnOut.carIn.easy.text" placeholder="请选择活动区域">
                    <el-option label="%P\%VM" :value="'%P\%VM'"></el-option>
                    <el-option label="%P\%VM请稍候" :value="'%P\%VM请稍候'"></el-option>
                    <el-option label="%P\剩余%VT天" :value="'%P\剩余%VT天'"></el-option>
                    <el-option label="%P\欢迎光临" :value="'%P\欢迎光临'"></el-option>
                    <el-option label="欢迎回家" :value="'欢迎回家'"></el-option>
                    <el-option label="%P\车辆已锁定" :value="'%P\车辆已锁定'"></el-option>
                  </el-select>
                </el-form-item>
                <el-form-item label="语音" label-width="40px">
                  <el-select :disabled="editModelReadonly" filterable allow-create v-model="showMessage.validInWarnOut.carIn.easy.voice" placeholder="请选择活动区域">
                    <el-option label="%P%VM" :value="'%P%VM'"></el-option>
                    <el-option label="%P%VM请稍候" :value="'%P%VM请稍候'"></el-option>
                    <el-option label="%P剩余%VT天" :value="'%P剩余%VT天'"></el-option>
                    <el-option label="%P欢迎光临" :value="'%P欢迎光临'"></el-option>
                    <el-option label="欢迎回家" :value="'欢迎回家'"></el-option>
                    <el-option label="%P车辆已锁定" :value="'%P车辆已锁定'"></el-option>
                  </el-select>
                </el-form-item>
              </div>
              <div class="rowItem">
                <el-form-item label="文本" label-width="40px">
                  <el-select :disabled="editModelReadonly" filterable allow-create v-model="showMessage.validInWarnOut.carIn.hard.text" placeholder="请选择活动区域">
                    <el-option label="%P\%VM" :value="'%P\%VM'"></el-option>
                    <el-option label="%P\%VM请稍候" :value="'%P\%VM请稍候'"></el-option>
                    <el-option label="%P\剩余%VT天" :value="'%P\剩余%VT天'"></el-option>
                    <el-option label="%P\欢迎光临" :value="'%P\欢迎光临'"></el-option>
                    <el-option label="欢迎回家" :value="'欢迎回家'"></el-option>
                    <el-option label="%P\车辆已锁定" :value="'%P\车辆已锁定'"></el-option>
                  </el-select>
                </el-form-item>
                <el-form-item label="语音" label-width="40px">
                  <el-select :disabled="editModelReadonly" filterable allow-create v-model="showMessage.validInWarnOut.carIn.hard.voice" placeholder="请选择活动区域">
                    <el-option label="%P%VM" :value="'%P%VM'"></el-option>
                    <el-option label="%P%VM请稍候" :value="'%P%VM请稍候'"></el-option>
                    <el-option label="%P剩余%VT天" :value="'%P剩余%VT天'"></el-option>
                    <el-option label="%P欢迎光临" :value="'%P欢迎光临'"></el-option>
                    <el-option label="欢迎回家" :value="'欢迎回家'"></el-option>
                    <el-option label="%P车辆已锁定" :value="'%P车辆已锁定'"></el-option>
                  </el-select>
                </el-form-item>
              </div>
            </div>

            <!-- 出场 -->
            <div class="row">
              <p>宽出</p>
              <p>严出</p>
            </div>
            <div class="row">
              <div class="rowItem">
                <el-form-item label="文本" label-width="40px">
                  <el-select :disabled="editModelReadonly" filterable allow-create v-model="showMessage.validInWarnOut.carOut.easy.text" placeholder="请选择活动区域">
                    <el-option label="%P\%VM" :value="'%P\%VM'"></el-option>
                    <el-option label="%P\%VM请稍候" :value="'%P\%VM请稍候'"></el-option>
                    <el-option label="%P\剩余%VT天" :value="'%P\剩余%VT天'"></el-option>
                    <el-option label="%P\欢迎光临" :value="'%P\欢迎光临'"></el-option>
                    <el-option label="欢迎回家" :value="'欢迎回家'"></el-option>
                    <el-option label="%P\车辆已锁定" :value="'%P\车辆已锁定'"></el-option>
                  </el-select>
                </el-form-item>
                <el-form-item label="语音" label-width="40px">
                  <el-select :disabled="editModelReadonly" filterable allow-create v-model="showMessage.validInWarnOut.carOut.easy.voice" placeholder="请选择活动区域">
                    <el-option label="%P%VM" :value="'%P%VM'"></el-option>
                    <el-option label="%P%VM请稍候" :value="'%P%VM请稍候'"></el-option>
                    <el-option label="%P剩余%VT天" :value="'%P剩余%VT天'"></el-option>
                    <el-option label="%P欢迎光临" :value="'%P欢迎光临'"></el-option>
                    <el-option label="欢迎回家" :value="'欢迎回家'"></el-option>
                    <el-option label="%P车辆已锁定" :value="'%P车辆已锁定'"></el-option>
                  </el-select>
                </el-form-item>
              </div>
              <div class="rowItem">
                <el-form-item label="文本" label-width="40px">
                  <el-select :disabled="editModelReadonly" filterable allow-create v-model="showMessage.validInWarnOut.carOut.hard.text" placeholder="请选择活动区域">
                    <el-option label="%P\%VM" :value="'%P\%VM'"></el-option>
                    <el-option label="%P\%VM请稍候" :value="'%P\%VM请稍候'"></el-option>
                    <el-option label="%P\剩余%VT天" :value="'%P\剩余%VT天'"></el-option>
                    <el-option label="%P\欢迎光临" :value="'%P\欢迎光临'"></el-option>
                    <el-option label="欢迎回家" :value="'欢迎回家'"></el-option>
                    <el-option label="%P\车辆已锁定" :value="'%P\车辆已锁定'"></el-option>
                  </el-select>
                </el-form-item>
                <el-form-item label="语音" label-width="40px">
                  <el-select :disabled="editModelReadonly" filterable allow-create v-model="showMessage.validInWarnOut.carOut.hard.voice" placeholder="请选择活动区域">
                    <el-option label="%P%VM" :value="'%P%VM'"></el-option>
                    <el-option label="%P%VM请稍候" :value="'%P%VM请稍候'"></el-option>
                    <el-option label="%P剩余%VT天" :value="'%P剩余%VT天'"></el-option>
                    <el-option label="%P欢迎光临" :value="'%P欢迎光临'"></el-option>
                    <el-option label="欢迎回家" :value="'欢迎回家'"></el-option>
                    <el-option label="%P车辆已锁定" :value="'%P车辆已锁定'"></el-option>
                  </el-select>
                </el-form-item>
              </div>
            </div>

            <h3 style="text-align:left;margin-bottom: 10px;">有效期内，提醒期内</h3>
            <!-- 进场 -->
            <div class="row">
              <p>宽进</p>
              <p>严进</p>
            </div>
            <div class="row">
              <div class="rowItem">
                <el-form-item label="文本" label-width="40px">
                  <el-select :disabled="editModelReadonly" filterable allow-create v-model="showMessage.validInWarnIn.carIn.easy.text" placeholder="请选择活动区域">
                    <el-option label="%P\%VM" :value="'%P\%VM'"></el-option>
                    <el-option label="%P\%VM请稍候" :value="'%P\%VM请稍候'"></el-option>
                    <el-option label="%P\剩余%VT天" :value="'%P\剩余%VT天'"></el-option>
                    <el-option label="%P\欢迎光临" :value="'%P\欢迎光临'"></el-option>
                    <el-option label="欢迎回家" :value="'欢迎回家'"></el-option>
                    <el-option label="%P\车辆已锁定" :value="'%P\车辆已锁定'"></el-option>
                  </el-select>
                </el-form-item>
                <el-form-item label="语音" label-width="40px">
                  <el-select :disabled="editModelReadonly" filterable allow-create v-model="showMessage.validInWarnIn.carIn.easy.voice" placeholder="请选择活动区域">
                    <el-option label="%P%VM" :value="'%P%VM'"></el-option>
                    <el-option label="%P%VM请稍候" :value="'%P%VM请稍候'"></el-option>
                    <el-option label="%P剩余%VT天" :value="'%P剩余%VT天'"></el-option>
                    <el-option label="%P欢迎光临" :value="'%P欢迎光临'"></el-option>
                    <el-option label="欢迎回家" :value="'欢迎回家'"></el-option>
                    <el-option label="%P车辆已锁定" :value="'%P车辆已锁定'"></el-option>
                  </el-select>
                </el-form-item>
              </div>
              <div class="rowItem">
                <el-form-item label="文本" label-width="40px">
                  <el-select :disabled="editModelReadonly" filterable allow-create v-model="showMessage.validInWarnIn.carIn.hard.text" placeholder="请选择活动区域">
                    <el-option label="%P\%VM" :value="'%P\%VM'"></el-option>
                    <el-option label="%P\%VM请稍候" :value="'%P\%VM请稍候'"></el-option>
                    <el-option label="%P\剩余%VT天" :value="'%P\剩余%VT天'"></el-option>
                    <el-option label="%P\欢迎光临" :value="'%P\欢迎光临'"></el-option>
                    <el-option label="欢迎回家" :value="'欢迎回家'"></el-option>
                    <el-option label="%P\车辆已锁定" :value="'%P\车辆已锁定'"></el-option>
                  </el-select>
                </el-form-item>
                <el-form-item label="语音" label-width="40px">
                  <el-select :disabled="editModelReadonly" filterable allow-create v-model="showMessage.validInWarnIn.carIn.hard.voice" placeholder="请选择活动区域">
                    <el-option label="%P%VM" :value="'%P%VM'"></el-option>
                    <el-option label="%P%VM请稍候" :value="'%P%VM请稍候'"></el-option>
                    <el-option label="%P剩余%VT天" :value="'%P剩余%VT天'"></el-option>
                    <el-option label="%P欢迎光临" :value="'%P欢迎光临'"></el-option>
                    <el-option label="欢迎回家" :value="'欢迎回家'"></el-option>
                    <el-option label="%P车辆已锁定" :value="'%P车辆已锁定'"></el-option>
                  </el-select>
                </el-form-item>
              </div>
            </div>

            <!-- 出场 -->
            <div class="row">
              <p>宽出</p>
              <p>严出</p>
            </div>
            <div class="row">
              <div class="rowItem">
                <el-form-item label="文本" label-width="40px">
                  <el-select :disabled="editModelReadonly" filterable allow-create v-model="showMessage.validInWarnIn.carOut.easy.text" placeholder="请选择活动区域">
                    <el-option label="%P\%VM" :value="'%P\%VM'"></el-option>
                    <el-option label="%P\%VM请稍候" :value="'%P\%VM请稍候'"></el-option>
                    <el-option label="%P\剩余%VT天" :value="'%P\剩余%VT天'"></el-option>
                    <el-option label="%P\欢迎光临" :value="'%P\欢迎光临'"></el-option>
                    <el-option label="欢迎回家" :value="'欢迎回家'"></el-option>
                    <el-option label="%P\车辆已锁定" :value="'%P\车辆已锁定'"></el-option>
                  </el-select>
                </el-form-item>
                <el-form-item label="语音" label-width="40px">
                  <el-select :disabled="editModelReadonly" filterable allow-create v-model="showMessage.validInWarnIn.carOut.easy.voice" placeholder="请选择活动区域">
                    <el-option label="%P%VM" :value="'%P%VM'"></el-option>
                    <el-option label="%P%VM请稍候" :value="'%P%VM请稍候'"></el-option>
                    <el-option label="%P剩余%VT天" :value="'%P剩余%VT天'"></el-option>
                    <el-option label="%P欢迎光临" :value="'%P欢迎光临'"></el-option>
                    <el-option label="欢迎回家" :value="'欢迎回家'"></el-option>
                    <el-option label="%P车辆已锁定" :value="'%P车辆已锁定'"></el-option>
                  </el-select>
                </el-form-item>
              </div>
              <div class="rowItem">
                <el-form-item label="文本" label-width="40px">
                  <el-select :disabled="editModelReadonly" filterable allow-create v-model="showMessage.validInWarnIn.carOut.hard.text" placeholder="请选择活动区域">
                    <el-option label="%P\%VM" :value="'%P\%VM'"></el-option>
                    <el-option label="%P\%VM请稍候" :value="'%P\%VM请稍候'"></el-option>
                    <el-option label="%P\剩余%VT天" :value="'%P\剩余%VT天'"></el-option>
                    <el-option label="%P\欢迎光临" :value="'%P\欢迎光临'"></el-option>
                    <el-option label="欢迎回家" :value="'欢迎回家'"></el-option>
                    <el-option label="%P\车辆已锁定" :value="'%P\车辆已锁定'"></el-option>
                  </el-select>
                </el-form-item>
                <el-form-item label="语音" label-width="40px">
                  <el-select :disabled="editModelReadonly" filterable allow-create v-model="showMessage.validInWarnIn.carOut.hard.voice" placeholder="请选择活动区域">
                    <el-option label="%P%VM" :value="'%P%VM'"></el-option>
                    <el-option label="%P%VM请稍候" :value="'%P%VM请稍候'"></el-option>
                    <el-option label="%P剩余%VT天" :value="'%P剩余%VT天'"></el-option>
                    <el-option label="%P欢迎光临" :value="'%P欢迎光临'"></el-option>
                    <el-option label="欢迎回家" :value="'欢迎回家'"></el-option>
                    <el-option label="%P车辆已锁定" :value="'%P车辆已锁定'"></el-option>
                  </el-select>
                </el-form-item>
              </div>
            </div>

            <h3 style="text-align:left;margin-bottom: 10px;">有效期外，删除期内</h3>
            <div class="rowItem">
              <el-form-item prop="vipDeleteExpiredDayThreshold" label="删除期" label-width="50px">
                <el-input placeholder="" v-model.number="vipTypeData.vipDeleteExpiredDayThreshold"></el-input>
                <span class="item-unit">天</span>
              </el-form-item>
            </div>

            <!-- 进场 -->
            <div class="row">
              <p>宽进-进场</p>
              <p>严进-进场</p>
            </div>
            <div class="row">
              <div class="rowItem">
                <el-form-item label="文本" label-width="40px">
                  <el-select :disabled="editModelReadonly" filterable allow-create v-model="showMessage.validOutDelIn.carIn.easy.text" placeholder="请选择活动区域">
                    <el-option label="%P\%VM已过期" :value="'%P\%VM已过期'"></el-option>
                    <el-option label="%VM已过期\应缴费%C元" :value="'%VM已过期\应缴费%C元'"></el-option>
                  </el-select>
                </el-form-item>
                <el-form-item label="语音" label-width="40px">
                  <el-select :disabled="editModelReadonly" filterable allow-create v-model="showMessage.validOutDelIn.carIn.easy.voice" placeholder="请选择活动区域">
                    <el-option label="%P%VM已过期" :value="'%P%VM已过期'"></el-option>
                    <el-option label="%VM已过期应缴费%C元" :value="'%VM已过期应缴费%C元'"></el-option>
                  </el-select>
                </el-form-item>
              </div>
              <div class="rowItem">
                <el-form-item label="文本" label-width="40px">
                  <el-select :disabled="editModelReadonly" filterable allow-create v-model="showMessage.validOutDelIn.carIn.hard.text" placeholder="请选择活动区域">
                    <el-option label="%P\%VM已过期" :value="'%P\%VM已过期'"></el-option>
                    <el-option label="%VM已过期\应缴费%C元" :value="'%VM已过期\应缴费%C元'"></el-option>
                  </el-select>
                </el-form-item>
                <el-form-item label="语音" label-width="40px">
                  <el-select :disabled="editModelReadonly" filterable allow-create v-model="showMessage.validOutDelIn.carIn.hard.voice" placeholder="请选择活动区域">
                    <el-option label="%P%VM已过期" :value="'%P%VM已过期'"></el-option>
                    <el-option label="%VM已过期应缴费%C元" :value="'%VM已过期应缴费%C元'"></el-option>
                  </el-select>
                </el-form-item>
              </div>
            </div>

            <!-- 出场 -->
            <div class="row">
              <p>宽出需缴费-出场</p>
              <p>宽出不需缴费-出场</p>
            </div>
            <div class="row">
              <div class="rowItem">
                <el-form-item label="文本" label-width="40px">
                  <el-select :disabled="editModelReadonly" filterable allow-create v-model="showMessage.validOutDelIn.carOutPay.easy.text" placeholder="请选择活动区域">
                    <el-option label="%P\%VM已过期" :value="'%P\%VM已过期'"></el-option>
                    <el-option label="%VM已过期\应缴费%C元" :value="'%VM已过期\应缴费%C元'"></el-option>
                  </el-select>
                </el-form-item>
                <el-form-item label="语音" label-width="40px">
                  <el-select :disabled="editModelReadonly" filterable allow-create v-model="showMessage.validOutDelIn.carOutPay.easy.voice" placeholder="请选择活动区域">
                    <el-option label="%P%VM已过期" :value="'%P%VM已过期'"></el-option>
                    <el-option label="%VM已过期应缴费%C元" :value="'%VM已过期应缴费%C元'"></el-option>
                  </el-select>
                </el-form-item>
              </div>
              <div class="rowItem">
                <el-form-item label="文本" label-width="40px">
                  <el-select :disabled="editModelReadonly" filterable allow-create v-model="showMessage.validOutDelIn.carOutNoPay.easy.text" placeholder="请选择活动区域">
                    <el-option label="%P\%VM已过期" :value="'%P\%VM已过期'"></el-option>
                    <el-option label="%VM已过期\应缴费%C元" :value="'%VM已过期\应缴费%C元'"></el-option>
                  </el-select>
                </el-form-item>
                <el-form-item label="语音" label-width="40px">
                  <el-select :disabled="editModelReadonly" filterable allow-create v-model="showMessage.validOutDelIn.carOutNoPay.easy.voice" placeholder="请选择活动区域">
                    <el-option label="%P%VM已过期" :value="'%P%VM已过期'"></el-option>
                    <el-option label="%VM已过期应缴费%C元" :value="'%VM已过期应缴费%C元'"></el-option>
                  </el-select>
                </el-form-item>
              </div>
            </div>

            <div class="row">
              <p>严出需缴费-出场</p>
              <p>严出不需缴费-出场</p>
            </div>
            <div class="row">
              <div class="rowItem">
                <el-form-item label="文本" label-width="40px">
                  <el-select :disabled="editModelReadonly" filterable allow-create v-model="showMessage.validOutDelIn.carOutPay.hard.text" placeholder="请选择活动区域">
                    <el-option label="%P\%VM已过期" :value="'%P\%VM已过期'"></el-option>
                    <el-option label="%VM已过期\应缴费%C元" :value="'%VM已过期\应缴费%C元'"></el-option>
                  </el-select>
                </el-form-item>
                <el-form-item label="语音" label-width="40px">
                  <el-select :disabled="editModelReadonly" filterable allow-create v-model="showMessage.validOutDelIn.carOutPay.hard.voice" placeholder="请选择活动区域">
                    <el-option label="%P%VM已过期" :value="'%P%VM已过期'"></el-option>
                    <el-option label="%VM已过期应缴费%C元" :value="'%VM已过期应缴费%C元'"></el-option>
                  </el-select>
                </el-form-item>
              </div>
              <div class="rowItem">
                <el-form-item label="文本" label-width="40px">
                  <el-select :disabled="editModelReadonly" filterable allow-create v-model="showMessage.validOutDelIn.carOutNoPay.hard.text" placeholder="请选择活动区域">
                    <el-option label="%P\%VM已过期" :value="'%P\%VM已过期'"></el-option>
                    <el-option label="%VM已过期\应缴费%C元" :value="'%VM已过期\应缴费%C元'"></el-option>
                  </el-select>
                </el-form-item>
                <el-form-item label="语音" label-width="40px">
                  <el-select :disabled="editModelReadonly" filterable allow-create v-model="showMessage.validOutDelIn.carOutNoPay.hard.voice" placeholder="请选择活动区域">
                    <el-option label="%P%VM已过期" :value="'%P%VM已过期'"></el-option>
                    <el-option label="%VM已过期应缴费%C元" :value="'%VM已过期应缴费%C元'"></el-option>
                  </el-select>
                </el-form-item>
              </div>
            </div>

          </div>
        </el-form>
      </div>
      <div class="modal-footer" slot="modal-footer">
        <button class="ake_btn ake_btn_text ake_btn_confirm" @click="submitTextVoice('textVoiceModal')">确认</button>
        <button class="ake_btn ake_btn_text" @click="closed('textVoiceModal')">取消</button>
      </div>
    </basic-modal>
    <!-- 显示及语音 end -->

    <!--支持的停车场-表格-->
    <basic-modal ref="supportParkModal" width="580" customeClass="surpport-park-modal" static="true">
      <h3 slot="title">支持停车场</h3>
      <div class="modal-body" slot="modal-body">
        <multi-fun-table hasCheckboxCol="false" tableBoxId="supportParkTable" isNeedPrint="false" isSetTable="false" sortColumn='' orderType='' fixed-cols="0" :theads-info="supportPark.theadsInfo" :tbodys-info="supportParkList">
          <!--普通列-->
          <template slot="tdCell" slot-scope="props">
            <el-table-column :fixed="props.fixed" :label="props.label" :min-width="props.minWidth" :width="props.width" :prop="props.prop" :sortable="props.sortable">
              <template slot-scope="scope">
                <span>{{ scope.row[props.prop] }}</span>
              </template>
            </el-table-column>
          </template>
        </multi-fun-table>
      </div>
      <div class="modal-footer" slot="modal-footer">
        <button class="ake_btn ake_btn_text modal-close" @click="closed('supportParkModal')">关闭</button>
      </div>
    </basic-modal>

    <!--同步详情-->
    <basic-modal ref="synchronismDetialModal" width="1200" customeClass="surpport-park-modal" static="true">
      <h3 slot="title">同步详情</h3>
      <div class="modal-body" slot="modal-body">
        <multi-fun-table hasCheckboxCol="false" tableBoxId="supportParkTable" isNeedPrint="false" isSetTable="false" sortColumn='' orderType='' fixed-cols="0" :theads-info="synchronismDetial.theadsInfo" :tbodys-info="supportParkList">
          <!--普通列-->
          <template slot="tdCell" slot-scope="props">
            <el-table-column :fixed="props.fixed" :label="props.label" :min-width="props.minWidth" :width="props.width" :prop="props.prop" :sortable="props.sortable">
              <template slot-scope="scope">
                <span v-if="'sendTime' == props.prop">{{scope.row.sendTime|mileSecondToDate}}</span>
                <span v-else-if="'resend' == props.prop">
                  <el-button size="small" type="primary" class="ake_btn_text" v-if="true" @click="resend(scope.row)">重新同步</el-button>
                </span>
                <span v-else>{{ scope.row[props.prop] }}</span>
              </template>
            </el-table-column>
          </template>
        </multi-fun-table>
      </div>
      <div class="modal-footer" slot="modal-footer">
        <button class="ake_btn ake_btn_text modal-close" @click="closed('synchronismDetialModal')">关闭</button>
      </div>
    </basic-modal>

    <!--选择停车场树-->
    <basic-modal ref="selectParkModal" width="400" customeClass="select-park-modal" static="true">
      <h3 slot="title">选择通行权限</h3>
      <div class="modal-body" slot="modal-body">
        <ul id="ParkTree" name="ParkTree" class="ztree"></ul>
      </div>
      <div class="modal-footer" slot="modal-footer">
        <button type="button" class="ake_btn ake_btn_text ake_btn_confirm" @click="selectParkSure()">确认</button>
        <button class="ake_btn ake_btn_text modal-close" @click="closed('selectParkModal')">取消</button>
      </div>
    </basic-modal>

    <!-- 月票类型-查看 -->
    <basic-modal ref="monthTicketTypeCheck" width="640" customeClass="month-ticket-type-check" static="true" :needModalFooter="false">
      <h3 slot="title">{{monthTicketCheckObj.basicData.ticketName}}</h3>
      <div class="modal-body" slot="modal-body" style="padding:0px 0px 20px 0px;">
        <div class="btnGroup">
          <div @click="selectMonthTicketCheckInfoTab('basicTab')" class="btnItem" :class="{activeText:monthTicketCheckObj.tabName=='basicTab'}">
            <span class="step-icon" :class="{activeTab:monthTicketCheckObj.tabName=='basicTab'}">1</span>
            <span class="step-text">基础信息</span>
          </div>
          <div @click="selectMonthTicketCheckInfoTab('higherTab')" class="btnItem" :class="{activeText:monthTicketCheckObj.tabName=='higherTab'}">
            <span class="step-icon" :class="{activeTab:monthTicketCheckObj.tabName=='higherTab'}">2</span>
            <span class="step-text">高级配置</span>
          </div>
        </div>
        <div class="basicInfo" v-show="monthTicketCheckObj.tabName=='basicTab'">
          <table>
            <tr v-if="monthTicketCheckObj.basicData.channelArr && monthTicketCheckObj.basicData.channelArr.length" class="td-span">
              <td :rowspan="monthTicketCheckObj.basicData.channelArr.length">通行权限：</td>
              <td>
                <span>{{monthTicketCheckObj.basicData.channelArr[0].parkName}}</span>
                <span>{{monthTicketCheckObj.basicData.channelArr[0].channelName}}</span>
              </td>
            </tr>
            <tr v-else>
              <td>通行权限：</td>
              <td></td>
            </tr>
            <tr v-for="(item,index) in monthTicketCheckObj.basicData.channelArr" v-if="index>0" class="td-span">
              <td>
                <span>{{item.parkName}}</span>
                <span>{{item.channelName}}</span>
              </td>
            </tr>
            <tr>
              <td width="130">财务主体：</td>
              <td>{{monthTicketCheckObj.basicData.financialSubject}}</td>
            </tr>
            <tr>
              <td>月票类型名称：</td>
              <td>{{monthTicketCheckObj.basicData.monthTicketTypeName}}</td>
            </tr>
            <tr>
              <td>月票单价：</td>
              <td>{{monthTicketCheckObj.basicData.price}}元</td>
            </tr>
            <tr>
              <td>月票数量：</td>
              <td>{{monthTicketCheckObj.basicData.num}}</td>
            </tr>
            <tr>
              <td>有效期类型：</td>
              <td>{{monthTicketCheckObj.basicData.effectiveType}}</td>
            </tr>
            <tr>
              <td>备注：</td>
              <td>{{monthTicketCheckObj.basicData.remark}}</td>
            </tr>
          </table>
        </div>
        <div class="heightInfo" v-show="monthTicketCheckObj.tabName=='higherTab'">
          <table>
            <tr>
              <td width="130">线上开通：</td>
              <td>{{monthTicketCheckObj.superiorData.onlineOpen}}</td>
            </tr>
            <tr>
              <td>月票凭证：</td>
              <td>{{monthTicketCheckObj.superiorData.monthTicketProof}}</td>
            </tr>
            <tr>
              <td>过期续费：</td>
              <td>{{monthTicketCheckObj.superiorData.overduePaid}}</td>
            </tr>
            <tr v-if="monthTicketCheckObj.superiorData.overduePaid=='允许'">
              <td class="td-top">连续续费：</td>
              <td v-if="monthTicketCheckObj.superiorData.overduePaidType=='折扣优惠'" class="more-p">
                <p>{{monthTicketCheckObj.superiorData.overduePaidType}}</p>
                <p v-for="(item,index) in monthTicketCheckObj.superiorData.overduePaidArr">
                  <span>{{index+1}}.</span>
                  <span>连续续费：{{item.month}}个月，</span>
                  <span>打{{item.discount}}折，</span>
                  <span>为{{item.totalPrice}}元，</span>
                  <span>手机端显示：</span>
                  <span>{{item.phoneStr}}</span>
                </p>
              </td>
              <td v-else-if="monthTicketCheckObj.superiorData.overduePaidType=='金额优惠'" class="more-p">
                <p>{{monthTicketCheckObj.superiorData.overduePaidType}}</p>
                <p v-for="(item,index) in monthTicketCheckObj.superiorData.overduePaidArr">
                  <span>{{index+1}}.</span>
                  <span>连续续费：{{item.month}}个月，</span>
                  <span>共{{item.totalPrice}}元，</span>
                  <span>手机端显示：</span>
                  <span>{{item.phoneStr}}</span>
                </p>
              </td>
              <td v-else>{{monthTicketCheckObj.superiorData.overduePaidType}}</td>
            </tr>
            <tr v-if="monthTicketCheckObj.superiorData.overduePaid=='允许'">
              <td>向前续费:</td>
              <td v-if="monthTicketCheckObj.superiorData.renewFormerDays">{{monthTicketCheckObj.superiorData.renewFormerDays}}天</td>
              <td v-else>0天</td>
            </tr>
            <tr>
              <td>无牌车：</td>
              <td>{{monthTicketCheckObj.superiorData.virtualCarCode}}</td>
            </tr>
            <tr>
              <td>访客授权：</td>
              <td v-if="monthTicketCheckObj.superiorData.visitorEmpower">允许授权{{monthTicketCheckObj.superiorData.visitorEmpower}}个访客车牌</td>
              <td v-else></td>
            </tr>
            <tr>
              <td class="td-top">多车多位：</td>
              <td class="more-p">
                <p>{{monthTicketCheckObj.superiorData.moreCarMoreSeat}}</p>
                <p v-if="monthTicketCheckObj.superiorData.autoSwitchVip=='支持'">支持场内切换</p>
                <p v-if="monthTicketCheckObj.superiorData.dynamicFullLimit=='支持'">场内多位多车满位到剩余，同一VIP票车辆外场已在场车辆无法进入内场</p>
              </td>
            </tr>
            <tr>
              <td class="td-top">满位控制：</td>
              <td class="more-p">
                <p>{{monthTicketCheckObj.superiorData.openVipFullLimit}}</p>
                <p v-if="monthTicketCheckObj.superiorData.vipFullLimitValue">最多可进{{monthTicketCheckObj.superiorData.vipFullLimitValue}}辆</p>
                <p v-if="monthTicketCheckObj.superiorData.openVipFullLimit=='支持'">{{monthTicketCheckObj.superiorData.vipFullOpenModel | vipFullOpenModel}}</p>
              </td>
            </tr>
            <tr>
              <td>按日期：</td>
              <td v-if="monthTicketCheckObj.superiorData.isDatePrivilege=='支持'">
                <a href="javascript:;" @click="openCalendar()" class="a_link">查看详情</a>
              </td>
              <td v-else>不支持</td>
            </tr>
            <tr>
              <td>按时段：</td>
              <td v-if="monthTicketCheckObj.superiorData.isTimePrivilege=='支持'">{{monthTicketCheckObj.superiorData.timeSlot}}</td>
              <td v-else>不支持</td>
            </tr>
            <tr>
              <td class="td-top">是否计费：</td>
              <td v-if="monthTicketCheckObj.superiorData.iScharging=='是'" class="more-p">
                <p>是</p>
                <p v-for="(item,index) in tableData.parkItems">
                  <span>{{index+1}}.{{item.parkName}}：</span>
                  <template v-if="item.parkSysType===0">
                    <span>{{item.chargeGroupCode}}</span>
                  </template>
                  <template v-else>
                    <span v-for="it in item.optionArr" v-if="it.chargeTypeSeq==item.chargeGroupCode">
                      {{it.typeName}}
                    </span>
                  </template>
                </p>
              </td>
              <td v-else>否</td>
            </tr>
            <tr>
              <td>离线月票：</td>
              <td>{{monthTicketCheckObj.superiorData.offLine}}</td>
            </tr>
          </table>
        </div>
      </div>
      <div class="modal-footer" slot="modal-footer">
      </div>
    </basic-modal>

  </div>
</template>

<script>
import common from "@mixins/common.js";
import ztreeSearch from "@mixins/ztreeSearch.js";
import stardardList from "@mixins/tables/stardardList.js";
// 日期组件
import Calendar from "@components/calendar/Calendar";

//modal
import invokeModal from "@mixins/modal/invokeModal.js";
import "../../assets/js/libs/jquery.ztree.core.min.js";
import "../../assets/js/libs/jquery.ztree.excheck.min.js";

// 引进vue的js
import js from "./js/manage.js";

export default {
  name: 'monthTicketManage',
  mixins: [common, ztreeSearch, stardardList, invokeModal, js],
  components: {
    Calendar,
  },
  data() {
    return {
      chargeGroupRender:true,
      total: 0,
      fixedCols: 4,
      paramName: "query_parkId",
      searchList: [
        {
          index: 0,
          isShow: false,
          type: "select",
          name: "query_ticketName",
          text: "月票类型名称",
          value: "",
          filterable: true,
          options:[]
        },
        {
          index: 1,
          isShow: false,
          type: "select",
          name: "query_ticketStatus",
          text: "状态",
          value: "",
          options: [
            { name: "--全部--", value: "" },
            { name: "未上架", value: "0" },
            { name: "已上架", value: "1" },
          ]
        },
        {
          index: 2,
          isShow: false,
          type: "text",
          name: "query_ticketCode",
          text: "月票类型编号",
          value: ""
        },
        {
          index: 3,
          isShow: false,
          type: "text",
          name: "query_remark",
          text: "备注",
          value: ""
        },
      ],
      theadsInfo: [
        {
          index: 1,
          isShow: false,
          prop: "ticketName",
          text: "月票类型名称"
        },
        {
          index: 2,
          isShow: false,
          prop: "parkList",
          text: "通行权限"
        },
        {
          index: 3,
          isShow: false,
          prop: "renewMethodStr",
          text: "有效期类型"
        },
        {
          index: 4,
          isShow: false,
          prop: "price",
          text: "单价"
        },
        {
          index: 5,
          isShow: false,
          prop: "maxSellLimit",
          text: "数量"
        },
        {
          index: 5,
          isShow: false,
          prop: "sellNum",
          text: "已售"
        },
        {
          index: 6,
          isShow: false,
          prop: "remark",
          text: "备注",
        },
        {
          index: 7,
          isShow: false,
          prop: "ticketCode",
          text: "月票类型编号",
          minWidth: 70,
        },
        {
          index: 8,
          isShow: false,
          prop: "updateBy",
          text: "最近操作人",
        },
        {
          index: 9,
          isShow: false,
          prop: "updateTime",
          text: "最近操作时间",
          minWidth: 80,
        }
      ],
      tbodysInfo: [],
    };
  }
};
</script>

<style lang="less" scoped>
@import "../../assets/less/libs/zTreeStyle.css";
@import "../../assets/less/manage.less";

.item-row.hasUnit {
  position: relative;
  .unit {
    position: absolute;
    right: 8px !important;
    top: 0;
  }
}
</style>
